<template>
  <div class="container">
    <el-row type="flex" justify="space-between">
      <!-- 订单表单 -->
      <OrderForm
        v-if="ticketData"
        :data="ticketData"
        @setToalPrice="setToalPrice"
      />

      <!-- 其他代码... -->
      <!-- 侧边栏组件 -->
      <OrderAside
        v-if="ticketData"
        :data="ticketData"
        :totalPrice="totalPrice"
      />
    </el-row>
  </div>
</template>

<script>
import OrderForm from "@/components/air/orderForm.vue";
import OrderAside from "@/components/air/orderAside.vue";

export default {
  data() {
    return {
      ticketData: null,
      totalPrice: 0
    };
  },
  created() {
    this.$axios({
      url: "/airs/" + this.$route.query.id,
      params: {
        seat_xid: this.$route.query.seat_xid
      }
    }).then(res => {
      console.log(res.data);
      this.ticketData = res.data;
    });
  },
  components: {
    OrderForm,
    OrderAside
  },
  methods: {
    setToalPrice(res) {
      this.totalPrice = res;
    }
  }
};
</script>
<style lang="less" scoped>
.container {
  width: 1000px;
  margin: 20px auto;
}

/*aside*/
.aside {
  width: 350px;
  height: fit-content;
  border: 1px #ddd solid;
}
</style>
